<template>
  <el-select @input="updateValue" style="width: 60%" v-model="localValue" :placeholder="placeholder">
    <el-option
      v-for="option in options"
      :key="option"
      :label="option"
      :value="option"
    />
  </el-select>
</template>

<script>
export default {
  props: {
    value: String,
    options: Array,
    placeholder: String
  },
  data() {
    return {
      localValue: this.value  // 创建本地副本
    };
  },
  watch: {
    value(newValue) {
      // 当父组件的 prop 改变时，更新本地副本
      this.localValue = newValue;
    }
  },
  methods: {
    updateValue(newValue) {
      // 更新本地值
      this.localValue = newValue;
      // 向父组件发出 input 事件，更新父组件的值
      this.$emit('input', newValue);
    }
  }
}
</script>
